<template>
  <div class="index">
    <div class="container mx-auto index">
      <img :src="require('@/assets/img/apple.jpg')" class="rounded shad" />
      <div
        class="my-8 overflow-hidden border rounded shadow-lg sm:flex sm:flex-wrap"
      >
        <div
          class="p-6 border-b sm:w-1/2 sm:border-r md:w1-/4 md:border-b-0 hover:bg-gray-800 group"
        >
          <h2 class="mb-2 text-2xl font-bold group-hover:text-white">
            没错，它来了。
          </h2>
          <p class="text-gray-500 group-hover:text-white">
            没错，它来了。Apple M1，我们首款专为 Mac
            打造的芯片，带来格外强大的性能、量身打造的技术，以及令人惊叹的能效表现。它从一开始，就为与
            macOS Big Sur
            这一先进桌面操作系统默契配合而设计。性能功耗比的重大跃进，也让配备
            M1 芯片的 Mac
            跨入完全不同的层次。这绝不是简单的升级，而是开创了一片新天地。
          </p>
        </div>
        <div
          class="p-6 border-b sm:w-1/2 md:w1-/4 md:border-r md:border-b-0 hover:bg-gray-800 group"
        >
          <h2 class="mb-2 text-2xl font-bold group-hover:text-white">
            没错，它来了。
          </h2>
          <p class="text-gray-500 group-hover:text-white">
            没错，它来了。Apple M1，我们首款专为 Mac
            打造的芯片，带来格外强大的性能、量身打造的技术，以及令人惊叹的能效表现。它从一开始，就为与
            macOS Big Sur
            这一先进桌面操作系统默契配合而设计。性能功耗比的重大跃进，也让配备
            M1 芯片的 Mac
            跨入完全不同的层次。这绝不是简单的升级，而是开创了一片新天地。
          </p>
        </div>
        <div
          class="p-6 border-b sm:w-1/2 sm:border-r sm:border-b-0 md:w1-/4 hover:bg-gray-800 group"
        >
          <h2 class="mb-2 text-2xl font-bold group-hover:text-white">
            没错，它来了。
          </h2>
          <p class="text-gray-500 group-hover:text-white">
            没错，它来了。Apple M1，我们首款专为 Mac
            打造的芯片，带来格外强大的性能、量身打造的技术，以及令人惊叹的能效表现。它从一开始，就为与
            macOS Big Sur
            这一先进桌面操作系统默契配合而设计。性能功耗比的重大跃进，也让配备
            M1 芯片的 Mac
            跨入完全不同的层次。这绝不是简单的升级，而是开创了一片新天地。
          </p>
        </div>
        <div class="p-6 sm:w-1/2 md:w1-/4 hover:bg-gray-800 group">
          <h2 class="mb-2 text-2xl font-bold group-hover:text-white">
            没错，它来了。
          </h2>
          <p class="text-gray-500 group-hover:text-white">
            没错，它来了。Apple M1，我们首款专为 Mac
            打造的芯片，带来格外强大的性能、量身打造的技术，以及令人惊叹的能效表现。它从一开始，就为与
            macOS Big Sur
            这一先进桌面操作系统默契配合而设计。性能功耗比的重大跃进，也让配备
            M1 芯片的 Mac
            跨入完全不同的层次。这绝不是简单的升级，而是开创了一片新天地。
          </p>
        </div>
      </div>
    </div>
  </div>
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";
export default defineComponent({
  //   setup() {},
});
</script>
<style lang="scss" scoped>
.index {
  width: 100vw;
  height: 100vh;
  overflow: auto;
}
</style>
